<template>
  <section @click="handleClick">
    <p style="font-size: 2rem;color:#66FFFF; font-weight: 700; height: 2rem">
      {{ importData.count }}
    </p>
    <p style="color: rgba(255, 255, 255, .8);font-size:1.2rem;">{{ importData.title }}</p>
  </section>
</template>

<script>
export default {
  name: "BgList",
 props:{
   importData: {
     type: Object,
     default: [],
   },
 },
  methods:{
    handleClick(){
      this.$emit('handleClick',this.importData)
    }
  }
}
</script>

<style lang="scss" scoped>
section {
  width: 50%;
  height: 100%;
  border: 1px solid transparent;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  //align-content: center;
  background:url('~@/assets/images/devOps/data_bg.png') center bottom no-repeat;
  background-size: 80% ;

  p {
    width: 100%;
    margin-bottom: 2px;
  }

}
</style>
